<template>
    <div class="search">
        <p style="color: #606266; font-size: 14px;">
            <i class="el-icon-s-home"></i>
            <span>&nbsp;授课查询</span>
        </p>

        <el-card class="box-card" :body-style="{ padding: '10px 25px' }">
            <el-table :data="tableData" stripe style="width: 100%" max-height="540px" v-loading="loading">
                <el-table-column prop="id" label="课程Id">
                </el-table-column>
                <el-table-column prop="name" label="课程名">
                </el-table-column>
                <el-table-column prop="grade" label="年级">
                </el-table-column>
                <el-table-column prop="credit" label="学分">
                </el-table-column>
                <el-table-column prop="time" label="上课时间">
                </el-table-column>
                <el-table-column prop="location" label="上课地点">
                </el-table-column>
                <el-table-column prop="selectedCount" label="选课人数">
                </el-table-column>
            </el-table>
        </el-card>



    </div>
</template>

<script>
import { getCourseList } from '@/api/teacher/course';
export default {
    components: {},
    data() {
        return {
            tableData: [],
            loading: false
        }
    },
    methods: {


        getList() {
            this.loading = true
            getCourseList().then(res => {
                console.log(res)
                if (res.code === 0) {
                    this.tableData = res.data
                }
            }).finally(() => {
                this.loading = false
            })
        }

    },
    mounted() {
        this.getList()
    }
}
</script>

<style lang="scss" scoped>
.search {
    height: 100%;

    .box-card {
        width: 100%;
        margin-top: 5px;
        font-size: 14px;
    }
}
</style>